<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <!--<link href="css/bootstrap.min.css" rel="stylesheet">-->
    <link href="css/news.css" type="text/css" rel="stylesheet">
    <title>新闻</title>

    <style type="text/css">
        h2.top_title {
            border-bottom: none;
            background: none;
            text-align: center;
            line-height: 32px;
            font-size: 20px
        }
        h2.top_title span {
            font-size: 12px;
            color: #666;
            font-weight: 500
        }
    </style>
</head>
<body>

<div class="header">
    <div class="head_content">
        <div class="head_logo">
            <img src="img/logo_03.png">
        </div>

        <!--导航栏-->
        <nav class="head_navbar">
            <ul id="main">
                <li><a href="home.html">首页</a></li>
                <li>
                    <a>社团</a>
                    <ul class="drop">
                        <div>
                            <li><a href="cj.html">程序设计基础协会</a></li>
                            <li><a href="acm.html">ACM协会</a></li>
                            <li><a href="bgs.html">不甘社</a></li>
                            <li><a href="wkf.html">微开发</a></li>
                        </div>
                    </ul>

                </li>
                <li><a href="works.html">作品</a></li>
                <li><a href="news.html">新闻</a></li>
                <li><a href="about.html">关于我们</a></li>
                <div id="marker"></div>
            </ul>
        </nav>
    </div>
</div>


<h2 class="top_title" style="padding: ;">
    <a href="" style="color: #007bc4/*#424242*/; text-decoration: none; outline: none;">HTML5+CSS3实现的响应式垂直时间轴</a>
    <br/>
    <span>请使用IE9+或Chrome，Firefox高级浏览器或手机访问本页</span>
</h2>

<section id="cd-timeline" class="cd-container">
    <div class="cd-timeline-block">
        <div class="cd-timeline-img cd-picture">
            <img src="img/cd-icon-picture.svg" alt="Picture">
        </div>

        <div class="cd-timeline-content">
            <h2>HTML5+CSS3实现的响应式垂直时间轴</h2>
            <p>
                网页时间轴一般用于展示以时间为主线的事件，如企业网站常见的公司发展历程等。本文将给大家介绍一款基于HTML5和CSS3的漂亮的垂直时间轴，它可以响应页面布局，适用于HTML5开发的PC和移动手机WEB应用。</p>
            <a href="http://www.helloweba.com/view-blog-285.html" class="cd-read-more" target="_blank">阅读全文</a>
            <span class="cd-date">2015-01-06</span>
        </div>
    </div>
    <div class="cd-timeline-block">
        <div class="cd-timeline-img cd-movie">
            <img src="img/cd-icon-movie.svg" alt="Movie">
        </div>

        <div class="cd-timeline-content">
            <h2>jQuery+PHP动态数字展示效果</h2>
            <p>我们在一些应用中需要动态展示数据，比如当前在线人数，当前交易总额，当前汇率等等，前端页面需要实时刷新获取最新数据。本文将结合实例给大家介绍使用jQuery和PHP来实现动态数字展示效果。</p>
            <a href="http://www.helloweba.com/view-blog-284.html" class="cd-read-more" target="_blank">阅读全文</a>
            <span class="cd-date">2014-12-25</span>
        </div>
    </div>
    <div class="cd-timeline-block">
        <div class="cd-timeline-img cd-picture">
            <img src="img/cd-icon-picture.svg" alt="Picture">
        </div>

        <div class="cd-timeline-content">
            <h2>PHP操作Session和Cookie</h2>
            <p>我们跟踪用户信息时需要用到Session和Cookie，比如用户登录验证、记录用户浏览历史，存储购物车数据，限制用户会话有效时间等。今天我们来了解下PHP是如何操作Session和Cookie的。</p>
            <a href="http://www.helloweba.com/view-blog-283.html" class="cd-read-more" target="_blank">阅读全文</a>
            <span class="cd-date">2014-12-20</span>
        </div>
    </div>
    <div class="cd-timeline-block">
        <div class="cd-timeline-img cd-movie">
            <img src="img/cd-icon-movie.svg" alt="Movie">
        </div>

        <div class="cd-timeline-content">
            <h2>jQuery数字加减插件</h2>
            <p>
                我们在网上购物提交订单时，在网页上一般会有一个选择数量的控件，要求买家选择购买商品的件数，开发者会把该控件做成可以通过点击实现加减等微调操作，当然也可以直接输入数字件数。本文将介绍常见的几种使用spinner数字微调器来实现数字加减的功能的方法。</p>
            <a href="http://www.helloweba.com/view-blog-282.html" class="cd-read-more" target="_blank">阅读全文</a>
            <span class="cd-date">2014-12-14</span>
        </div>
    </div>
    <div class="cd-timeline-block">
        <div class="cd-timeline-img cd-movie">
            <img src="img/cd-icon-location.svg" alt="Location">
        </div>

        <div class="cd-timeline-content">
            <h2>收集整理的非常有用的PHP函数</h2>
            <p>项目中经常会需要一些让人头疼的函数，作为开发者应该整理一个自己的函数库，在需要之时复制过来即可。本文作者收集整理数十个PHP项目中常用的函数，保证能正常运行，你只要复制粘贴到你项目中即可。</p>
            <a href="http://www.helloweba.com/view-blog-281.html" class="cd-read-more" target="_blank">阅读全文</a>
            <span class="cd-date">2014-12-05</span>
        </div>
    </div>
</section>


<div class="foot">

    <div class="bottom">
        <div class="bottom_content">
            <div class="left">
                <div><img src="img/logo_without_text.png"></div>
                <p>版权所有：北京理工大学珠海学院计算机科技协会</p>
            </div>
            <div class="right">
                <div class="qr_code_box">
                    <div><img src="img/qq_qt_code.jpg"></div>
                    <p>2016级程序程基协会qq群</p>
                </div>
                <div class="qr_code_box">
                    <div><img src="img/wechat_qt_code.jpg"></div>
                    <p>计算机科技协会服务号</p>
                </div>
            </div>
        </div>
    </div>

</div>

</body>
</html>